{% extends "../_base/layout.html" %} 
{% block css %}
<link rel="stylesheet" href="{{site.static}}/css/index_activity.css"> 
{% endblock %}
{% block content %} 
    {% block header%}
    {% set pageHeaderConf = {pageTitle:__("activity_page_title"),level:2} %} 
    {% include "../_base/page_header.html" %} 
    {% endblock %}
<div class="eui-main-container eui--padding-b-0 activity-main-container">
    <div class="eui-page-banner">
        <ul class="eui-bar-tab eui--clearfix">
            <li class="eui-tab-item">
                <a href="javascript:;" class="eui-tab-nav-link active">{{__("activity_nav_one")}}</a>
            </li>
            <li class="eui-tab-item">
                <a href="javascript:;" class="eui-tab-nav-link">{{__("activity_nav_two")}}</a>
            </li>
            <li class="eui-tab-item">
                <a href="javascript:;" class="eui-tab-nav-link vip-nav-link eui--vip-color">
                    <span class="eui-icon eui-icon-vip"></span>
                    <!--<span>{{__("activity_nav_three")}}</span>-->
                    {{__("activity_nav_three")}}
                </a>
            </li>
        </ul>
    </div>        
    <div class="eui-card">
        <div class="eui-card-header">
            {{__("activity_card_title")}}            
        </div>
        <div class="eui-card-content">
           <ui class="eui-table-view">
                <li class="eui-table-view-cell">
                    <div class="eui-media">
                        <div class="eui-media-header">
                            <p class="eui--ellipsis eui--font-28 eui--black-color">活动标题活动标题活动标题活动标题活动标题</p>
                        </div>
                        <div class="eui-media-body eui--clearfix">
                            <img class="eui-media-img eui--width-100" src="{{site.cdn}}/test-banner.jpg" alt="">
                            <div class="eui-media-object eui--pull-right eui--font-24">
                                 <span class="eui-icon eui-icon-clock_active"></span>
                                <span class="day-num">3</span> {{__("activity_end_day")}}                            
                            </div>                           
                        </div>                        
                        <div class="eui-media-footer">
                            <a href="" class="eui-btn eui-btn-primary eui-btn-lg">{{__("btn_join")}}</a>                                
                        </div>
                    </div>                    
                </li>
                <li class="eui-table-view-cell activity-ended">
                    <div class="ended-overlay">
                        已结束
                    </div>
                    <div class="eui-media">
                        <div class="eui-media-header">
                            <p class="eui--ellipsis eui--font-28">活动标题活动标题活动标题活动标题活动标题</p>
                        </div>
                        <div class="eui-media-body eui--clearfix">
                            <img class="eui-media-img eui--width-100" src="{{site.cdn}}/test-banner.jpg" alt="">
                            <div class="eui-media-object eui--pull-right eui--font-24">
                                 <span class="eui-icon eui-icon-clock"></span>
                                <span class="day-num">3</span> {{__("activity_end_day")}}                            
                            </div>                           
                        </div>                        
                    </div>                    
                </li>
            </ui>                 
        </div>
    </div>    
</div>
{% endblock %}